<template>
    <div class="integral">
        <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css">
        <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css">
        <headerNav  :isShowBack="true" title="积分商城"></headerNav>
        <div class="weui-cells" style="position:relative;top:85px">
            <div id="graytxt" style=" position:fixed;left:20px;top:65px;">可用积分<br/>
                <span id="Inum" >22</span>
            </div>
            <div id="graytxt" style=" position:fixed;left:20px;top:160px;">
                <span id="g-blacktxt">积分明细</span>&nbsp;&nbsp;
                <span id="line">|</span>&nbsp;&nbsp;
                <span id="g-blacktxt">兑换记录</span>
            </div>
            <img src="~assets/img/integral/icon.png" style=" position:fixed;right:10px;top:60px;" width="94.8" height="94.8"/>
        </div>

        <hr id="hrs" style="margin-top:150px;"/>

        <div class="weui-cells wh" style="margin-left:20px;margin-top:20px;" id="graytxt" >
            <div class="wh w" >
                <img src="~assets/img/integral/1-1.png" width="100%" height="100%" /><br>
                <span id="g-blacktxt">外卖买二赠一劵</span><br/>
                <span id="orangetxt">2400</span> 积分
            </div>
            <div class="img-right wh w">
                <img src="~assets/img/integral/1-2.png" width="100%" height="100%"  /><br/>
                <span id="g-blacktxt" >外卖波波家族劵</span><br/>
                <span id="orangetxt">2800</span> 积分
            </div>
            
            <div class="wh w img-top" >
                <img src="~assets/img/integral/2-1.png" width="100%" height="100%" /><br/>
                <span id="g-blacktxt" >外卖买一赠一券</span><br/>
                <span id="orangetxt">2800</span> 积分
            </div>
            <div class="wh w img-top img-right" >
                <img src="~assets/img/integral/2-2.png" width="100%" height="100%" />
                <span id="g-blacktxt" >外卖咖啡券</span><br/>
                <span id="orangetxt">2900</span> 积分
            </div>

        </div>
        <div class="weui-footer">
            <p class="weui-footer__text" >没有更多了 ~</p>
        </div>
    </div>
</template>



<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/jquery-weui.min.js"></script>
<script>
  import headerNav from 'components/HeaderNav/headerNav'
    export default {
        name: "integral",
         components:{
             headerNav
        },
        methods:{
             back(){
                this.$router.back()
            }
        }
        
    }
</script>

<style scoped>
#Inum{
    font-size: 40px;
    color: #000;
}
.weui-cells{

}
.underword{
    text-align :center;
}
.underdiv{
    width: 100%;
    height: 100%;
}
.wh{
    float: left;
}

.w{
    width: 40%;
}
#graytxt{
    font-size: 10px;
    color: rgb(126, 119, 119);
}
#g-blacktxt{
    font-size: 10px;
    color: #000;
}
#orangetxt{
    font-size: 16px;
    color: rgb(204, 114, 30);
    vertical-align: bottom;
}
#line {
    font-size:20px;
}
#hrs{
    size: 30;
    height: 5px;
    background-color: rgb(238, 232, 232);
}
.img-right{
    margin-left: 40px;
}
.img-top{
    margin-top: 40px;
}

footer{
    clear: both;
    display: block;
    text-align: center;    
    margin: 0px auto;
    position: absolute;
    bottom: 100px;
}
</style>